<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="../css/common.css">
    <link rel="stylesheet" href="../css/slider.css">
    <link rel="stylesheet" href="../css/product-details.css">
    <link rel="stylesheet" href="../css/magnifier.css">


    <script src="../lib/jquery.js"></script>
    <script src="../js/common.js"></script>
    <script src="../js/jquery.slidebox.js"></script>
    <script src="../lib/magnifier.js"></script>
    <script src="../js/porduct-detalis.js"></script>
</head>

<body>

    <div>
        <!-- header -->
        <div id="header">
            <div class="top">
                <img src="../img/logo.jpg" alt="">
                <span>legochina.cn</span>
                <span class="clearfix">欢迎光临<a href="./Home.html">乐购</a>，请 登陆\<a>注册</a></span>
            </div>

            <!-- 搜索框/购物车 -->
            <div id="header-search">

                <div class="search">
                    <input type="text">
                    <div class="img-1"></div>
                </div>

                <div class="shopping">

                    <div class="shopp">
                        <i></i>
                        <span>购物车&emsp;0</span>
                    </div>

                    <div class="order">
                        <span>我的订单</span>
                    </div>

                </div>

            </div>

            <div id="nav">
                <span>图书</span>
                <span>电子书</span>
                <span>原创文学</span>
                <span>服装</span>
                <span>户外运动</span>
                <span>孕婴童</span>
                <span>家居</span>
                <span>创意文具</span>
                <span>地方特产</span>
                <span>海外购</span>
                <span>电器城</span>
            </div>

        </div>

        <!-- 详情 -->
        <div id="detalis">
            <p class="d-p1"><span>图书</span> > 小说 > 情感/家庭/婚姻 > 博集天卷 > 她和他</p>
            <div class="detalied clearfix">
                <div class="glass">
                    <!-- 左边放大镜区域 -->
                    <div class="leftbox">
                        <div class="magnifier" id="magnifier1">
                            <div class="magnifier-container">
                                <div class="images-cover"></div>

                                <div class="move-view"></div>

                            </div>
                            <div class="magnifier-assembly">
                                <div class="magnifier-btn">
                                    <span class="magnifier-btn-left">&lt;</span>
                                    <span class="magnifier-btn-right">&gt;</span>
                                </div>

                                <div class="magnifier-line">
                                    <ul class="clearfix animation03">
                                        <li>
                                            <div class="small-img">
                                                <img src="../素材图片/书籍/22928335-1_l.jpg" />
                                            </div>
                                        </li>
                                        <li>
                                            <div class="small-img">
                                                <img src="../素材图片/书籍/22935553-1_l.jpg" />
                                            </div>
                                        </li>
                                        <li>
                                            <div class="small-img">
                                                <img src="../素材图片/书籍/23206608-1_l.jpg" />
                                            </div>
                                        </li>
                                        <li>
                                            <div class="small-img">
                                                <img src="../素材图片/书籍/23416622-1_b_1.jpg" />
                                            </div>
                                        </li>
                                        <li>
                                            <div class="small-img">
                                                <img src="../素材图片/书籍/23436139-1_l_1.jpg" />
                                            </div>
                                        </li>
                                    </ul>
                                </div>

                            </div>
                            <div class="magnifier-view"></div>

                        </div>

                    </div>

                </div>

                <div class="glass-rt">
                    <div class="glass-top">
                        <h3>他和她</h3>
                        <p>《偷影子的人》作者马克·李维重磅新作，法国连续60周在榜，销量突破120万册</p>
                        <p>[法] 马克·李维 著；杨亦雨 译</p>
                    </div>

                    <div class="price">
                        <p>乐 购 价：<span>￥26.20</span> [6.9折] [定价：<span>￥38.00</span>] (降价通知)</p>
                        <p>促销信息：<span>满减 每满150.00元，可减50.00元现金</span> 详情 >></p>

                        <span class="price-span">领券：</span>
                        <div class="full">100-6</div>
                        <div class="full">100-6</div>
                    </div>

                    <div class="glass-bt">
                        <div class="bt-top clearfix">
                            <span>种类选择：</span>
                            <div class="chose chose-on">平装版
                                <img src="../img/select.png" alt="" class="chose-img">
                            </div>
                            <div class="chose">精装版
                                <img src="../img/select.png" alt="">
                            </div>
                        </div>

                        <div class="bt-main clearfix">
                            <div class="num">
                                <input type="text" maxlength="3" value="1" class="tnum" readonly>
                                <div>
                                    <span class="jia">+</span>
                                    <span class="jian">-</span>
                                </div>
                            </div>
                            <span class="addsome">加入购物车</span>
                            <p class="ale">温馨提示：支持7天无理由退货</p>
                        </div>
                    </div>
                </div>

                <p class="bh">商品编号11950959</p>
            <div class="ljpj">累计评价<p>9999</p></div>
            </div>

            
        </div>

        <!-- 人气单品 -->
        <div class="hot">
            <p class="hot-p">人气单品</p>

            <table class="list-common hot-t">
                <tr>
                    <script>
                        for (let i = 1; i <= 5; i++) {
                            document.write(`<td>
                        <img src="../素材图片/书籍/22935553-1_l.jpg" alt="">
                        <img src="../img/index05_18.jpg" alt="">
                        <p>白夜行  东野上吾</p>
                        <span>推荐:</span><i></i>
                        <p>￥:38<span>￥:58</span></p>
                    </td>`)
                        }
                    </script>
                </tr>
            </table>

        </div>

        <div class="part1 clearfix">
            <div class="part-lt">

                <p class="plt-p">看了又看</p>

                <div class="plt-bt">


                    <table class="list-common hot-t">

                        <script>
                            for (let i = 1; i <= 7; i++) {
                                document.write(`<tr  class='detalis-td'><td>
                                    <img src="../素材图片/书籍/22935553-1_l.jpg" alt="">
                                    <img src="../img/index05_18.jpg" alt="">
                                    <p>白夜行  东野上吾</p>
                                    <span>推荐:</span><i></i>
                                    <p>￥:38<span>￥:58</span></p>
                                </td></tr>`)
                            }
                        </script>

                    </table>

                </div>

            </div>
            <div class="part-rt">
                <p class="prt-p">
                    <span>商品介绍</span>
                    <span class="prt-pon">评价（9999）</span>
                </p>

                <div class="dofp pad">
                    <img src="../img/xq.jpg" alt="" class="dofp-one-img">
                </div>
                
                <div class="dofp clearfix dofp-on">
                    <div class="pra98">
                        <p>98%</p>
                        <span>好评度</span>
                    </div>

                    <div class="hp">
                        <div class="hp1 clearfix">
                            <span>好评 (98%)</span>
                            <div><i></i></div>
                        </div>
                        <div class="hp2 clearfix">
                            <span>中评 (2%)</span>
                            <div><i></i></div>
                        </div>
                        <div class="hp3 clearfix">
                            <span>差评 (0%)</span>
                            <div><i></i></div>
                        </div>
                    </div>

                    <div class="dofp-tab">
                        <table>
                            <tr>
                                <td>1.洲**子&emsp;&emsp;&emsp;&emsp;+0 </td>
                                <td>2.洲**子 &emsp;&emsp;&emsp;&emsp; +0 </td>
                            </tr>
                            <tr>
                                <td>3.洲**子 &emsp;&emsp;&emsp; +10 </td>
                                <td>4.洲**子 &emsp;&emsp;&emsp; +10 </td>
                            </tr>
                        </table>
                    </div>

                    <div class="dofp-all">
                        <div class="da-p">
                            <span class="dap-on pj">全部评价（9999）</span>
                            <span class="pj">好评（888）</span>
                            <span class="pj">中评（888）</span>
                            <span class="pj">差评（888）</span>
                        </div>


                        <div class="coms coms-on">
                            <div class="zj comments-on">
                                <script>
                                    for (let i = 1; i <= 12; i++) {
                                        document.write(`<div class="comments clearfix">
                                    <div class="star">
                                        <i></i>
                                        <p>下单后5天评论</p>
                                        <p>2016-08-11</p>
                                    </div>
        
                                    <div class="cmt">书的质量不错，很新，一点放久的潮味或臭味都没有，内容也值得一看，关
                                        键是价格真给力</div>
        
                                    <div class="users">
                                        <div class="user-top clearfix">
                                            <img src="../img/index152.png" alt="">
                                            <span>洲**子</span>
                                        </div>
                                        <p>金牌会员</p>
                                        <p>来自iPhone客户端</p>
                                    </div>    
                                </div>`)
                                    }
                                </script>
                            </div>
                            <div class="zj">
                                <script>
                                    for (let i = 1; i <= 12; i++) {
                                        document.write(`<div class="comments clearfix">
                                    <div class="star">
                                        <i></i>
                                        <p>下单后5天评论</p>
                                        <p>2016-08-11</p>
                                    </div>
        
                                    <div class="cmt">书的质量不错，很新，一点放久的潮味或臭味都没有，内容也值得一看</div>
        
                                    <div class="users">
                                        <div class="user-top clearfix">
                                            <img src="../img/index152.png" alt="">
                                            <span>洲**子</span>
                                        </div>
                                        <p>金牌会员</p>
                                        <p>来自iPhone客户端</p>
                                    </div>    
                                </div>`)
                                    }
                                </script>
                            </div>
                            <div class="zj">
                                <script>
                                    for (let i = 1; i <= 12; i++) {
                                        document.write(`<div class="comments clearfix">
                                    <div class="star">
                                        <i></i>
                                        <p>下单后5天评论</p>
                                        <p>2016-08-11</p>
                                    </div>
        
                                    <div class="cmt">书的质量不错，很新，一点放久的潮味或臭味都没有</div>
        
                                    <div class="users">
                                        <div class="user-top clearfix">
                                            <img src="../img/index152.png" alt="">
                                            <span>洲**子</span>
                                        </div>
                                        <p>金牌会员</p>
                                        <p>来自iPhone客户端</p>
                                    </div>    
                                </div>`)
                                    }
                                </script>
                            </div>
                            <div class="zj">
                                <script>
                                    for (let i = 1; i <= 12; i++) {
                                        document.write(`<div class="comments clearfix">
                                    <div class="star">
                                        <i></i>
                                        <p>下单后5天评论</p>
                                        <p>2016-08-11</p>
                                    </div>
        
                                    <div class="cmt">书的质量不错，很新</div>
        
                                    <div class="users">
                                        <div class="user-top clearfix">
                                            <img src="../img/index152.png" alt="">
                                            <span>洲**子</span>
                                        </div>
                                        <p>金牌会员</p>
                                        <p>来自iPhone客户端</p>
                                    </div>    
                                </div>`)
                                    }
                                </script>
                            </div>
                            <div class="zj">
                                <script>
                                    for (let i = 1; i <= 12; i++) {
                                        document.write(`<div class="comments clearfix">
                                    <div class="star">
                                        <i></i>
                                        <p>下单后5天评论</p>
                                        <p>2016-08-11</p>
                                    </div>
        
                                    <div class="cmt">书的质量不错</div>
        
                                    <div class="users">
                                        <div class="user-top clearfix">
                                            <img src="../img/index152.png" alt="">
                                            <span>洲**子</span>
                                        </div>
                                        <p>金牌会员</p>
                                        <p>来自iPhone客户端</p>
                                    </div>    
                                </div>`)
                                    }
                                </script>
                            </div>
                            <div class="zj">
                                <script>
                                    for (let i = 1; i <= 12; i++) {
                                        document.write(`<div class="comments clearfix">
                                    <div class="star">
                                        <i></i>
                                        <p>下单后5天评论</p>
                                        <p>2016-08-11</p>
                                    </div>
        
                                    <div class="cmt">此用户未评论</div>
        
                                    <div class="users">
                                        <div class="user-top clearfix">
                                            <img src="../img/index152.png" alt="">
                                            <span>洲**子</span>
                                        </div>
                                        <p>金牌会员</p>
                                        <p>来自iPhone客户端</p>
                                    </div>    
                                </div>`)
                                    }
                                </script>
                            </div>
                            
                        </div>
                        <div class="coms">
                            <script>
                                for (let i = 1; i <= 12; i++) {
                                    document.write(`<div class="comments clearfix">
                                <div class="star">
                                    <i></i>
                                    <p>下单后5天评论</p>
                                    <p>2016-08-11</p>
                                </div>
    
                                <div class="cmt">书的质量不错，很新，一点放久的潮味或臭味都没有，内容也值得一看，关
                                    键是价格真给力</div>
    
                                <div class="users">
                                    <div class="user-top clearfix">
                                        <img src="../img/index152.png" alt="">
                                        <span>洲**子</span>
                                    </div>
                                    <p>金牌会员</p>
                                    <p>来自iPhone客户端</p>
                                </div>    
                            </div>`)
                                }
                            </script>
                        </div>
                        <div class="coms">
                            <script>
                                for (let i = 1; i <= 12; i++) {
                                    document.write(`<div class="comments clearfix">
                                <div class="star">
                                    <i></i>
                                    <p>下单后5天评论</p>
                                    <p>2016-08-11</p>
                                </div>
    
                                <div class="cmt">一般般吧也就，不值这个价</div>
    
                                <div class="users">
                                    <div class="user-top clearfix">
                                        <img src="../img/index152.png" alt="">
                                        <span>洲**子</span>
                                    </div>
                                    <p>金牌会员</p>
                                    <p>来自iPhone客户端</p>
                                </div>    
                            </div>`)
                                }
                            </script>
                        </div>
                        <div class="coms">
                            <script>
                                for (let i = 1; i <= 12; i++) {
                                    document.write(`<div class="comments clearfix">
                                <div class="star">
                                    <i></i>
                                    <p>下单后5天评论</p>
                                    <p>2016-08-11</p>
                                </div>
    
                                <div class="cmt">这不是纯垃圾？</div>
    
                                <div class="users">
                                    <div class="user-top clearfix">
                                        <img src="../img/index152.png" alt="">
                                        <span>洲**子</span>
                                    </div>
                                    <p>金牌会员</p>
                                    <p>来自iPhone客户端</p>
                                </div>    
                            </div>`)
                                }
                            </script>
                        </div>


                        <div class="k">
                            <table>
                                <tr class="ks">
                                    <td class="six six-on">1</td>
                                    <td class="six">2</td>
                                    <td class="six">3</td>
                                    <td class="six">4</td>
                                    <td class="six">5</td>
                                    <td class="six">6</td>

                                    <td class="pt">......</td>

                                    <td class="nex">下一页</td>
                                </tr>
                            </table>
                        </div>
                    </div>
                </div>

                
            </div>
        </div>

        <!-- 底部 -->
        <div id="foot">
            <div class="f-top">
                <img src="../img/gototop_05.jpg" alt="" class="retop">
                <div>
                    <img src="../img/222_11.png" alt="">
                    <img src="../img/222_13(1).png" alt="">
                    <img src="../img/222_15.png" alt="">
                    <img src="../img/222_17.png" alt="">
                </div>
            </div>

            <div class="f-main">
                <table>
                    <tr>
                        <td>购物指南</td>
                        <td>支付方式</td>
                        <td>订单服务</td>
                        <td>退换货</td>
                        <td>商家服务</td>
                    </tr>
                    <tr>
                        <td>购物指南</td>
                        <td>支付方式</td>
                        <td>订单服务</td>
                        <td>退换货</td>
                        <td>商家服务</td>
                    </tr>
                    <tr>
                        <td>购物指南</td>
                        <td>支付方式</td>
                        <td>订单服务</td>
                        <td>退换货</td>
                        <td>商家服务</td>
                    </tr>
                    <tr>
                        <td>购物指南</td>
                        <td>支付方式</td>
                        <td>订单服务</td>
                        <td>退换货</td>
                        <td>商家服务</td>
                    </tr>
                    <tr>
                        <td>购物指南</td>
                        <td>支付方式</td>
                        <td>订单服务</td>
                        <td>退换货</td>
                    </tr>

                </table>

                <div class="f-bt">
                    <p>公司简介 | Investor Relations | 网站联盟 | 乐购招商 | 机构销售 | 手机乐购 | 官方Blog | 热词搜索</p>
                    <span>Copyright (C) 乐购网 2004-2016, All Rights Reserved</span>
                </div>

                <img src="../img/logo_00.png" alt="">
            </div>
        </div>

        <!-- 滚动搜索框 -->
        <div class="search search-scroll">
            <input type="text">
            <div class="img-1"></div>
        </div>

        <div class="mc">
        </div>
    </div>

</body>

</html>